<template>
  <el-dialog :title="title" :width="width" :visible.sync="isShowVisible" center :close-on-click-modal="false" :before-close="() => $emit('notRefresh')">
    <el-card v-loading="isLoading">
      <el-form label-width="105px" :model="groupData" ref="groupData" :rules="rules">
        <el-row>
          <el-col :span="12">
            <el-form-item label="分类名称:" prop="ename" id="ename">
              <el-input v-model="groupData.ename"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="分类编码:" prop="enumber" id="enumber">
              <el-input v-model="groupData.enumber"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
       <el-form-item label="上级分类:" prop="eparentid" id="eparentid">
          <el-select v-model="groupData.eparentid" :disabled="groupId != 0 " filterable placeholder="请选择"><!---->
           <el-option v-for="item in groupList" :key="item.nodeId" :label="item.nodeName" :value="item.nodeId"/>
         </el-select>
        </el-form-item>
      </el-form>
    </el-card>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="saveGroup">保存</el-button>
      <el-button @click="$emit('notRefresh')">取消</el-button>
    </div>
  </el-dialog>
</template>

<script>
  import EquipmentCategoryApi from "@/api/module/EquipmentCategoryApi";

    export default {
      name: "equipment_addEdit",
      props: {
        width: { type: String, default: '40vw' },
        groupId: null,
        parentId: null,
      },
      data () {
        const validateParentId = (rule, value, callback) => {
          if (value === '') {
            callback(new Error('请选择上级分类'))
          } else {
            callback()
          }
        };
       return {
          title: '新增分类',
          isShowVisible: true,
          rules: {
            ename: [{ required: true, message: '请填写分类名称', tirgger: 'blur' }],
            enumber: [{ required: true, message: '请填写分类编码', tirgger: 'blur' }],
          },
          groupData: {},
          groupList: [],
          isLoading: false,
          http:new EquipmentCategoryApi(),
        }
      },
      async created () {
        this.isLoading = true
        let groupList = await this.http.queryGroupTree({})
        this.groupList = groupList.data
        console.log("groupList")
        console.log(groupList)
        if (this.parentId) {
          let groupData = {}
          groupData.eparentid = this.parentId + ""
          console.log("##"+groupData.id)
          console.log("--"+groupData)
          this.groupData = groupData
        } else {
            this.title = '编辑分类'
            let groupData = await this.http.detail({ eid: this.groupId })
            this.groupData = groupData.data
            this.isLoading = false
            console.log("分组--编辑分类")
            console.log(groupData)
        }

      },
      methods: {
        saveGroup () {
          this.$refs['groupData'].validate((valid, object) => {
            if (valid) {
              const loading = this.$loading({
                lock: true,
                text: '请耐心等待.....',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
              })
              //若有groupId证明时编辑没有则时新增
             if (this.groupId) {
               console.log("----")
               console.log(this.groupData)
               this.http.update(this.groupData).then(res => {
                  loading.close()
                  this.$tie.showSuccess(res.message)
                  this.$emit('close')
                }).catch(e => {
                  loading.close()
                })
              } else {
                this.http.add(this.groupData).then(res => {
                  loading.close()
                  this.$tie.showSuccess(res.message)
                  this.$emit('close ')
                }).catch(e => {
                  loading.close()
                })
              }
            } else {
              let validArr = []
              Object.keys(object).forEach(function (key) {
                validArr.push(key)
              });
              let validVal = "#" + validArr[0];
              document.querySelector(validVal).scrollIntoView(true);
            }
          })
        },
      },
    }
</script>

<style scoped>

</style>
